<template>
  <div>
    <div id="container" style="width: 100%; height: calc(100vh - 100px)">
      <baidu-map :center="center" :zoom="zoom" @ready="handler" style="height:1080px" @click="getClickInfo" :scroll-wheel-zoom='true'>
      </baidu-map>
</div>
  </div>
</template>

<script>



export default {
  name: "Map",
  data() {
    return {}
  },
  created() {

  },
  mounted() {
    // 创建地图实例
    // 百度地图API功能
    var map = new BMap.Map("allmap"); // 创建Map实例
    map.centerAndZoom(new BMap.Point(116.404, 39.915), 11); // 初始化地图,设置中心点坐标和地图级别
    map.addControl(new BMap.MapTypeControl()); //添加地图类型控件
    map.setCurrentCity("北京"); // 设置地图显示的城市 此项是必须设置的

  },
  methods: {

    handler ({BMap, map}) {
      var point = new BMap.Point(108.37345083,22.8226066)
      map.centerAndZoom(point, 13)
      var geolocation = new BMap.Geolocation();
      geolocation.getCurrentPosition(function(r){
        if(this.getStatus() == BMAP_STATUS_SUCCESS){
          var mk = new BMap.Marker(r.point);
          map.addOverlay(mk);
          map.panTo(r.point);
          // alert('您的位置：' + r.point.lng + ',' + r.point.lat);
        }
        else {
          alert('failed' + this.getStatus());
        }
      });


    },
  }
}
</script>

<style>

</style>
